﻿<!-- Logo Container -->
<div id="mws-logo-container">
        
    <!-- Logo Wrapper, images put within this wrapper will always be vertically centered -->
    <div id="mws-logo-wrap">
        <img src="@Url.Content("~/Content/images/mws-logo.png")" alt="mws admin" />
	</div>
</div>
        
<!-- User Tools (notifications, logout, profile, change password) -->
<div id="mws-user-tools" class="clearfix">
        
    <!-- Notifications -->
    <div id="mws-user-notif" class="mws-dropdown-menu">
        <a href="#" class="mws-i-24 i-alert-2 mws-dropdown-trigger">Notifications</a>
                
        <!-- Unread notification count -->
        <span class="mws-dropdown-notif">35</span>
                
        <!-- Notifications dropdown -->
        <div class="mws-dropdown-box">
            <div class="mws-dropdown-content">
                <ul class="mws-notifications">
                    <li class="read">
                        <a href="#">
                            <span class="message">
                                Lorem ipsum dolor sit amet consectetur adipiscing elit, et al commore
                            </span>
                            <span class="time">
                                January 21, 2012
                            </span>
                        </a>
                    </li>
                    <li class="read">
                        <a href="#">
                            <span class="message">
                                Lorem ipsum dolor sit amet
                            </span>
                            <span class="time">
                                January 21, 2012
                            </span>
                        </a>
                    </li>
                    <li class="unread">
                        <a href="#">
                            <span class="message">
                                Lorem ipsum dolor sit amet
                            </span>
                            <span class="time">
                                January 21, 2012
                            </span>
                        </a>
                    </li>
                    <li class="unread">
                        <a href="#">
                            <span class="message">
                                Lorem ipsum dolor sit amet
                            </span>
                            <span class="time">
                                January 21, 2012
                            </span>
                        </a>
                    </li>
                </ul>
                <div class="mws-dropdown-viewall">
	                <a href="#">View All Notifications</a>
                </div>
            </div>
        </div>
    </div>
            
    <!-- Messages -->
    <div id="mws-user-message" class="mws-dropdown-menu">
        <a href="#" class="mws-i-24 i-message mws-dropdown-trigger">Messages</a>
                
        <!-- Unred messages count -->
        <span class="mws-dropdown-notif">35</span>
                
        <!-- Messages dropdown -->
        <div class="mws-dropdown-box">
            <div class="mws-dropdown-content">
                <ul class="mws-messages">
                    <li class="read">
                        <a href="#">
                            <span class="sender">John Doe</span>
                            <span class="message">
                                Lorem ipsum dolor sit amet consectetur adipiscing elit, et al commore
                            </span>
                            <span class="time">
                                January 21, 2012
                            </span>
                        </a>
                    </li>
                    <li class="read">
                        <a href="#">
                            <span class="sender">John Doe</span>
                            <span class="message">
                                Lorem ipsum dolor sit amet
                            </span>
                            <span class="time">
                                January 21, 2012
                            </span>
                        </a>
                    </li>
                    <li class="unread">
                        <a href="#">
                            <span class="sender">John Doe</span>
                            <span class="message">
                                Lorem ipsum dolor sit amet
                            </span>
                            <span class="time">
                                January 21, 2012
                            </span>
                        </a>
                    </li>
                    <li class="unread">
                        <a href="#">
                            <span class="sender">John Doe</span>
                            <span class="message">
                                Lorem ipsum dolor sit amet
                            </span>
                            <span class="time">
                                January 21, 2012
                            </span>
                        </a>
                    </li>
                </ul>
                <div class="mws-dropdown-viewall">
	                <a href="#">View All Messages</a>
                </div>
            </div>
        </div>
    </div>
            
    <!-- User Information and functions section -->
    <div id="mws-user-info" class="mws-inset">
            
        <!-- User Photo -->
        <div id="mws-user-photo">
            <img src="@Url.Content("~/Content/example/profile.jpg")" alt="User Photo" />
        </div>
                
        <!-- Username and Functions -->
        <div id="mws-user-functions">
            <div id="mws-username">
                Hello, John Doe
            </div>
            <ul>
                <li><a href="#">Profile</a></li>
                <li><a href="#">Change Password</a></li>
                <li><a href="index.html">Logout</a></li>
            </ul>
        </div>
    </div>
</div>
